// 智慧童话世界 - JavaScript交互逻辑

let selectedTheme = '神奇的森林';
let currentStoryData = null;

// 页面加载完成后初始化
document.addEventListener('DOMContentLoaded', function() {
    initializeThemeSelection();
    initializeEventListeners();
});

// 初始化主题选择
function initializeThemeSelection() {
    const themeOptions = document.querySelectorAll('.theme-option');
    
    themeOptions.forEach(option => {
        option.addEventListener('click', function() {
            // 移除所有选中状态
            themeOptions.forEach(opt => opt.classList.remove('selected'));
            
            // 添加当前选中状态
            this.classList.add('selected');
            selectedTheme = this.getAttribute('data-theme');
        });
    });
}

// 初始化事件监听器
function initializeEventListeners() {
    // 生成故事按钮
    const generateBtn = document.querySelector('.generate-btn');
    if (generateBtn) {
        generateBtn.addEventListener('click', generateStory);
    }
}

// 生成故事
async function generateStory() {
    const childName = document.getElementById('childName').value.trim();
    const childAge = document.getElementById('childAge').value;
    const interests = document.getElementById('interests').value.trim();
    
    if (!childName) {
        alert('请输入小朋友的姓名！');
        return;
    }
    
    // 显示加载状态
    showLoading();
    
    try {
        const response = await fetch('/api/generate_story', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
            },
            body: JSON.stringify({
                name: childName,
                age: childAge,
                theme: selectedTheme,
                interests: interests
            })
        });
        
        const result = await response.json();
        
        if (result.success) {
            currentStoryData = result;
            displayStory(result.story);
            displayChoices(result.choices);
        } else {
            showError('故事生成失败：' + result.error);
        }
        
    } catch (error) {
        console.error('生成故事时出错:', error);
        showError('网络连接错误，请稍后重试');
    }
}

// 显示故事内容
function displayStory(storyText) {
    const storyContent = document.getElementById('storyContent');
    storyContent.innerHTML = storyText;
    
    // 添加打字机效果
    typeWriterEffect(storyContent, storyText);
}

// 打字机效果
function typeWriterEffect(element, text) {
    element.innerHTML = '';
    let index = 0;
    
    function typeChar() {
        if (index < text.length) {
            element.innerHTML += text.charAt(index);
            index++;
            setTimeout(typeChar, 50);
        }
    }
    
    typeChar();
}

// 显示选择按钮
function displayChoices(choices) {
    const choicesSection = document.getElementById('choicesSection');
    const choiceButtons = document.getElementById('choiceButtons');
    
    // 清空现有按钮
    choiceButtons.innerHTML = '';
    
    // 创建选择按钮
    choices.forEach((choice, index) => {
        const button = document.createElement('button');
        button.className = 'choice-btn';
        button.textContent = `${index + 1}. ${choice}`;
        button.onclick = () => makeChoice(index);
        choiceButtons.appendChild(button);
    });
    
    // 显示选择区域
    choicesSection.style.display = 'block';
}

// 处理用户选择
async function makeChoice(choiceIndex) {
    showLoading();
    
    try {
        const response = await fetch('/api/make_choice', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
            },
            body: JSON.stringify({
                choice_index: choiceIndex
            })
        });
        
        const result = await response.json();
        
        if (result.success) {
            displayStory(result.story);
            displayChoices(result.choices);
        } else {
            showError('选择处理失败：' + result.error);
        }
        
    } catch (error) {
        console.error('处理选择时出错:', error);
        showError('网络连接错误，请稍后重试');
    }
}

// 重置故事
async function resetStory() {
    if (confirm('确定要重新开始新的故事吗？')) {
        try {
            await fetch('/api/reset_story', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                }
            });
            
            // 重置界面
            document.getElementById('storyContent').innerHTML = `
                欢迎来到智慧童话世界！🌟
                
                这里是一个神奇的地方，AI会为每个小朋友创造独一无二的童话故事。
                
                请在左侧设置小朋友的信息，然后点击"开始生成专属童话"按钮，让我们一起开始这段奇妙的旅程吧！
                
                ✨ 每个故事都融入了智源研究院的教育数据
                🎯 根据年龄段智能调整内容难度
                🌈 支持多种主题和个性化定制
                🔀 可选择的分支剧情，每次都有新体验
            `;
            
            document.getElementById('choicesSection').style.display = 'none';
            currentStoryData = null;
            
        } catch (error) {
            console.error('重置故事时出错:', error);
            showError('重置失败，请刷新页面重试');
        }
    }
}

// 显示加载状态
function showLoading() {
    const storyContent = document.getElementById('storyContent');
    storyContent.innerHTML = '<div class="loading">正在生成精彩的故事</div>';
    
    // 隐藏选择区域
    document.getElementById('choicesSection').style.display = 'none';
}

// 显示错误信息
function showError(message) {
    const storyContent = document.getElementById('storyContent');
    storyContent.innerHTML = `
        <div style="color: #e53e3e; text-align: center; padding: 20px;">
            ❌ ${message}
            <br><br>
            <button onclick="location.reload()" style="padding: 10px 20px; background: #667eea; color: white; border: none; border-radius: 5px; cursor: pointer;">
                🔄 刷新页面
            </button>
        </div>
    `;
}

// 获取故事历史
async function getStoryHistory() {
    try {
        const response = await fetch('/api/get_story_history');
        const result = await response.json();
        
        if (result.success) {
            console.log('故事历史:', result.history);
            return result.history;
        }
    } catch (error) {
        console.error('获取故事历史时出错:', error);
    }
    
    return [];
}